﻿{% load staticfiles %}
{% load gravatar %}
{% load karma %}
<!DOCTYPE html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>reSRC &#183; {% block title %}{% endblock %}</title>
  {% block meta %}{% endblock %}
  <link rel="stylesheet" href="{% static "css/app.css" %}">
  <link rel="stylesheet" href="{% static "icons/foundation-icons.css" %}">
  <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Open+Sans:300italic,400,300,700|Arvo' rel='stylesheet' type='text/css'>
  {% block extrahead %}{% endblock %}
  <script src="{% static "bower_components/modernizr/modernizr.js" %}"></script>
  <link rel="shortcut icon" type="image/png" href="{% static "img/favicon.png" %}">
</head>
<body>
  <div class="contain-to-grid">
    <!-- Header and Nav -->
    <nav class="top-bar" data-topbar>
      <ul class="title-area">
        <li class="name">
          <h1><a href="{% url "home" %}">reSRC</a></h1>
        </li>
        <li class="toggle-topbar menu-icon"><a href="#"><span>nav</span></a></li>
      </ul>

      <section class="top-bar-section">
        <ul class="left">
          <li>
            <a href="{% url "links" %}">Links</a>
          </li>
          <li>
            <a href="{% url "new-link" %}" title="Add a link" class="add-button">
              <i class="fi-plus"></i>
              <span class="help-label">Add a link</span>
            </a>
          </li>
          <li>
            <a href="{% url "lists" %}">Lists</a>
          </li>
          <li>
            <a href="{% url "new-list" %}" title="Create a list" class="add-button">
              <i class="fi-plus"></i>
              <span class="help-label">Create a list</span>
            </a>
          </li>
          <li>
            <a href="{% url "tag-index" %}">Tags</a>
          </li>
          <li>
            <a href="{% url "page-search" %}">
              Search
              <span class="round alert label">new</span>
            </a>
          </li>
        </ul>

        <ul class="right">
          {% if user.is_authenticated %}
          <li class="has-dropdown ">
            <a href="{% url "user-url" user.username %}">
              <span class="round secondary label" data-tooltip title="Your karma">{{ user|karma }}</span>
              {% gravatar user.email 24 %}
              {{ user.username }}
            </a>
            <ul class="dropdown">
              <li><a href="{% url "my-links" %}">My links</a></li>
              <li><a href="{% url "user-lists" user.username %}">My lists</a></li>
              <li><a href="{% url "upvoted-list" %}">My upvotes</a></li>
              <li><a href="{% url "user-settings" %}">Edit profile</a></li>
              <li><a href="{% url "user-account" %}">Edit account</a></li>
              <li><a href="{% url "user-logout" %}">Logout</a></li>
            </ul>
          </li>
          {% else %}
          <li>
            <a href="{% url "user-register" %}">Register</a>
          </li>
          <li>
            <a href="{% url "user-login" %}">Login</a>
          </li>
          {% endif %}
        </ul>
      </section>
    </nav>
    <!-- End Header and Nav -->
  </div>

{% block breadcrumb_container %}
<div class="row">
  <div class="large-12 columns">
    <ul class="breadcrumbs">
      {% block breadcrumb %}<li class="current"><a href="{% url "home" %}">Home</a></li>{% endblock %}
    </ul>
  </div>
</div>
{% endblock %}

  <!-- content -->
  {% block content %}{% endblock %}

  {% block footer_container %}
  <!-- Footer -->
  <footer class="row">
    <div class="large-12 columns">
      <hr />
      <div class="row">
        <div class="small-5 columns">
          <p>{{ version }}</p>
        </div>
        <div class="small-7 columns">
          <ul class="inline-list right">
            <li><a href="{% url "home" %}">home</a></li>
            <li><a href="/list/421/resrcio-faq/">FAQ</a></li>
            <li><a href="{% url "page-about" %}">about</a></li>
          </ul>
        </div>
      </div>
    </div>
  </footer>
  {% endblock %}

  <script src="{% static "bower_components/jquery/dist/jquery.min.js" %}"></script>
  <script src="{% static "bower_components/foundation/js/foundation.min.js" %}"></script>
  <script>
    $(document).foundation();
    $(document).ready(function() {
      $('.error:has(.serverside.error)')
      .find('.clientside.error').css('display', 'none').end() // force clientside errors not to be shown yet
      .find('input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled])').one('focus', function() {
         $(this).closest('.error:has(.error.serverside)').removeClass('error')
         .find('.serverside').css('display', 'none').end() // force serverside not to be shown again
         .find('.clientside').removeAttr('style'); // undo force clientside not to be shown yet
      })
    });
  </script>

  {% block last_body %}{% endblock %}
  <a href="https://github.com/vhf/resrc" onClick="_gaq.push(['_trackEvent', 'Intervention', 'Fork Ribbon', '{{ user.username }}']);"><img class="fork-me-ribbon" src="https://s3.amazonaws.com/github/ribbons/forkme_left_red_aa0000.png" alt="Fork me on GitHub"></a>
</body>
</html>
